<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <title>报名课程</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link rel="stylesheet" href="../css/main.css">
    <link rel="stylesheet" href="./css/head.css">
    <link rel="stylesheet" href="./css/enroll_index.css">
    <style>

    </style>
</head>

<body>
    <div style="height: 40px;"></div>
    <div class="header">
        <div class="header_title">报名课程</div>
        <img src="../image/return.png" alt="" class="return" onclick="history.back()">
    </div>
    <div id="vue-root">
        <div class="head_title">
            <div class="border-right"></div>
            <div>学生列表</div>
        </div>
        <div class="enroll_content" :style="{'height': heights + 'px'}">
            <div class="student_card" v-for="student in students" :key="student.id" @click="goUrl(student.id)">
                <div class="student_card_top">
                    <div class="student_card_item1">
                        <div class="overflows">{{ student.name }}</div>
                        <img :src="getImg(student.avatar)" class="tx" />
                    </div>
                    <div class="student_card_item2">
                        <div class="item_text1_box">
                            <div class="item_text1 overflows">生日</div>
                            <div class="item_text1 overflows">{{ student.birthday }}</div>
                        </div>
                        <div class="item_text1_box2">
                            <div class="item_text1 overflows">学生来源</div>
                            <div class="item_text1 overflows">{{ getSourceText(student.source) }}</div>
                        </div>
                    </div>
                    <div class="student_card_item2">
                        <div class="item_text1_box">
                            <div class="item_text1 overflows">手机号</div>
                            <div class="item_text2 overflows">{{ student.phone }}</div>
                        </div>
                        <div class="item_text1_box2">
                            <div class="item_text1 overflows">家庭地址</div>
                            <div class="item_text2 overflows">{{ student.address }}</div>
                        </div>
                    </div>
                    <div class="student_card_item2">
                        <div class="item_text1_box">
                            <div class="item_text3 overflows">跟进状态</div>
                            <div class="item_text3 overflows">{{ getStatusText(student.status) }}</div>
                        </div>
                        <div class="item_text1_box2">
                            <div class="item_text3 overflows">就读学校</div>
                            <div class="item_text3 overflows">{{ student.schoolName }}</div>
                        </div>
                    </div>
                    <div class="student_card_item2">
                        <div class="item_text1_box">
                            <div class="item_text3 overflows">跟进人</div>
                            <div class="item_text3 overflows">{{ student.people }}</div>
                        </div>
                        <div class="item_text1_box2">
                            <div class="item_text3 overflows">绑定码</div>
                            <div class="item_text3 overflows">{{ student.bindCode }}</div>
                        </div>
                    </div>
                </div>
                <div class="student_card_bottom">
                    <span>查看更多</span>
                    <img src="../image/img/xiaLa_icon.png" alt="">
                </div>
            </div>
        </div>
    </div>

    <script src="/scriptZIP/vue.min.js"></script>
    <script src="/scriptZIP/axios.min.js"></script>
    <script src="/scriptZIP/dayjs.min.js"></script>
    <script src="/js/common.js"></script>

    <script>
        new Vue({
            el: '#vue-root',
            data: {
                heights: '',
                students: [],
                teacher: null
            },
            created: function () {
                this.teacher = getTeacher();
                this.heights = document.body.clientHeight - 104;
                // this.fetchStudents();
            },
            methods: {
                fetchStudents: function () {
                    axios.get('/t/getSchoolStudent?schoolId=' + this.teacher.schoolId)
                        .then(response => {
                            this.students = response.data;
                        })
                        .catch(error => {
                            console.error('获取学生数据失败', error);
                        });
                },
                goUrl: function (studentId) {
        const student = this.students.find(s => s.id === studentId);
        if (student) {
            localStorage.setItem('selectedStudent', JSON.stringify(student));
            window.location = 'enroll_course.html';
        } else {
            console.error('学生数据未找到:', studentId);
        }
    },
                getImg: function (pic) {
					if (!pic) return '../image/img/user.jpg';
					return '/static/' + this.teacher.schoolId + '/student/' + pic;
				},
                getSourceText: function (source) {
                    switch (source) {
                        case 1:
                            return '电话邀约';
                        case 2:
                            return '上门咨询';
                        case 3:
                            return '已选址未装修';
                        case 4:
                            return '转介绍';
                        case 5:
                            return '地推数据';
                        case 6:
                            return '家长分享';
                        case 7:
                            return '美团转化';
                           
                        default:
                            return '其他';
                    }
                },
                getStatusText:function (status) {
                    switch (status) {
                        case 1:
                            return '待跟进';
                        case 2:
                            return '跟进中';
                        case 3:
                            return '到访';
                        case 4:
                            return '体验学员';
                        case 5:
                            return '正式学员';
                        case 6:
                            return '已失效';
                        case 7:
                            return '无效';
                           
                        default:
                            return '其他';
                    }
                },
            }
        });
    </script>

</body>

</html>
